<template>
	<view class="">
		<view class="Topbg">
			<view class="info">
				<view class="u-flex">
					
					<u-image :src="info.avter" width="80" height="80" shape="circle"></u-image>
					<view class="u-margin-left-20">
						<view class="">
							<view style="color: #FFFFFF;font-size: 34rpx;">{{info.name}}</view>
						</view>
					</view>
				</view>
			</view>
		</view>


		<view class="mode" style="margin-top: 40rpx;">
			<navigator url="../book/index" hover-class="none">
				<u-cell-item title="订单中心"></u-cell-item>
			</navigator>
			<view style="margin:0 0 40rpx 0;">
				<u-grid :col="5" :border="false">
					<u-grid-item v-for="(item,index) in bookList" :key="index" index="item" @click="clickGrid2(item)">
					  
						<u-badge :count="item.count" :offset="[20, 20]" bgColor="#FF7E01" ></u-badge>
						
					
						<u-image :src="item.img" width="80" height="80"></u-image>
						<view class="grid-text">{{item.txt}}</view>
					</u-grid-item>
				</u-grid>
			</view>
		</view>






		<view class="classrow">
			<u-cell-group :border="false">
				<u-cell-item title="地址管理" @click="cell('../address/index')"></u-cell-item>
				<u-cell-item title="账号信息" @click="cell('../info/index')"></u-cell-item>
				<u-cell-item title="联系客服" class="custom-btn">
					<button open-type="contact"></button>

				</u-cell-item>
			</u-cell-group>

		</view>






	</view>
</template>

<script>
	import url from '@/common/baseUrl.js';
	export default {

		data() {
			return {
				imagesurl: url.imageUrl,
				info: {
					avter: "",
					name: "",
					dengji: ""
				},


				bookList: [{
                    count:0,
					img: "/static/order_df.png",
					txt: "待付款",
					url: "../../pages/book/index?block=1"
				}, {
					count:"",
					img: "/static/order_dfh.png",
					txt: "待发货",
					url: "../../pages/book/index?block=2"
				}, {
					count:"",
					img: "/static/order_dsh.png",
					txt: "待收货",
					url: "../../pages/book/index?block=3"
				}, {
					 count:0,
					img: "/static/order_wc.png",
					txt: "已完成",
					url: "../../pages/book/index?block=4"
				}, {
					count:0,
					img: "/static/order_sh.png",
					txt: "售后",
					url: "../../pages/book/index?block=5"
				}]

			}
		},
		onShow() {
			this.$u.post('/api/user/information', {

			}, {}).then(res => {
				var {
					headimg,
					levelId,
					nickname
				} = res.data;
				this.info.avter = headimg;
				this.info.name = nickname;
			}).catch(err => {})
                
				this.$u.post('/api/indent/orderNum', {
				
				}, {}).then(res => {
					var {
						noDelivery,
						noSignFor
					} = res.data;
					if(noDelivery){
						this.bookList[1].count=noDelivery
					}
					if(noSignFor){
						this.bookList[2].count=noSignFor
					}
									
				
				}).catch(err => {})
				
				
		},
		methods: {
			qiandao() {
				uni.navigateTo({
					url: "../getJinfen/index"
				})
			},

			clickGrid2(item) {
				uni.navigateTo({
					url: item.url
				})
			},
			fenxiao() {
				uni.navigateTo({
					url: "../fenxiaoCenter/index"
				})
			},
			kanjian() {
				uni.navigateTo({
					url: "../kanjia/index"
				})
			},
			cell(item) {
				uni.navigateTo({
					url: item
				})
			}
		}
	}
</script>

<style lang="scss">
	.Topbg {
		height: 150rpx;
		background: #037705;
		display: inline-block;
		width: 750rpx;

	}
.u-badge--bg--error{
	transform: scale(1.2);
}
.mode{
	width: 690rpx;
	background: #FFFFFF;
	border-radius: 40rpx;
	margin: auto;
	box-shadow: 0px 4rpx 6rpx rgba(209, 209, 209, 0.25);
	
}
	.info {
		display: flex;
		padding: 40rpx;
		justify-content: space-between;
	}


	.classrow {
		width: 690rpx;

		background: #FFFFFF;
		box-shadow: 0px 4rpx 6rpx rgba(209, 209, 209, 0.26);
		border-radius: 20rpx;
		margin: 40rpx auto;
	}

	.grid-text {
		margin-top: 10rpx;
	}
</style>
